<template>
  <div class="detail-wraper">
    <customerDetail :key="this.$route.query.id" :data="{id: this.$route.query.id,customerContactId: this.$route.query.customerContactId}" :from="this.$route.query.from"/>
  </div>
</template>

<script>
  import Vue from 'vue'
  import { Tabs,TabPane } from 'element-ui'
  import {mapGetters, mapActions, mapMutations} from 'vuex';
  import * as types from '../../store/mutation-types/customer/index';
  import CustomerDetail from '~components/customerDetailnew.vue';
  import { setToken  } from '~/utils/auth'

  Vue.use(Tabs);
  Vue.use(TabPane);


  export default {
    components: {
        CustomerDetail
    },
    head(){
        return {
            title: "客户详情",
            meta: [
                { hid: 'customer-index', name: 'customer-index', content: 'customer-index' }
            ]
        }
    },
    data () {
      return {
          detailTabsValue: null
      }
    },
    methods: {
        removeTab(targetName){
            let tabs = this.customerDetailList;
            let activeName = this.detailTabsValue;
            if (activeName === targetName) {
                tabs.forEach((tab, index) => {
                    if ((tab.id+'') === targetName) {
                        let nextTab = tabs[index + 1] || tabs[index - 1];
                        if (nextTab) {
                            activeName = nextTab.id+'';
                        }
                    }
                });
            }

            this.detailTabsValue = activeName;
            this.$store.commit(types.CHANGECUSTOMERDETAIL,{data:tabs.filter(tab => (tab.id+'') !== targetName)})
        }
    },
    computed: {
      ...mapGetters({
        customerDetailList: 'getCustomerDetailList'
      })
    },
    asyncData ({ store, query }) {
        /*if(!store.state.customers.customerDetailList.length){
            store.commit('CHANGECUSTOMERDETAIL',{data:[{id: query.id,customerContactId: query.customerContactId,name: query.customerName}]});
        }
        if(query.from == 'index') {
            return { detailTabsValue: store.state.customers.customerDetailList[store.state.customers.customerDetailList.length-1].id + '' }
        }*/
    },
    created() {
      setToken('parentUrl','customerDetail');

    }
  }
</script>

<style lang="scss">
  .detail-wraper{
    padding-top: 20px;
  }
</style>